import { ActionTree } from 'vuex';
import types from './types';
import { merge } from 'lodash';
import axios from 'axios';
const defaultElement = {
  id: null,
  name: null,
  type: null,
  show: true,
  group: null,
  custom: [],
  transform: {
    width: 100,
    height: 100,
    top: 0,
    left: 0,
    rotate: 0
  },
  data: {
    type: null,
    source: null,
    map: []
  },
  event: {},
  animation: [],
  extra: {},
  border: {
    size: 0,
    style: '',
    color: '',
    radius: 0,
    source: '',
    slice: 0,
    outset: 0,
    repeat: ''
  }
};

const actions: ActionTree<any, any> = {

  setLogin ({ commit }, flag: boolean): void {
    commit(types.DEMO, flag);
  },
  actChangeElement ({ commit }, info: any): void {
    commit(types.CHANGE_ELEMENT, info);
  },
  actRemoveElement ({ commit }, info: any): void {
    commit(types.REMOVE_ELEMENT, info);
  },
  actAddElement ({ commit ,state },element: any): void {
    element.name = element.name || ('组件' + state.elementList.length);
    element.id = element.id || Date.now();
    commit(types.ADD_ELEMENT, merge({},defaultElement,element));
  },
  actSelectCurElement ({ commit },id: number): void {
    commit(types.SELECT_CUR_ELEMENT, id);
  },
  setMenuVisible ({ commit }, visible): void {
    commit(types.MENU_VISIBLE, visible);
  },
  actAddSelectedElements ({ commit,getters },elementIds: any): void {
    commit(types.ADD_SELECTED_ELEMENTS, elementIds);
    setTimeout(() => {
      commit(types.CHANGE_SELECTED_ELEMENTS_TRANSFORM,{ selectedElements: getters.selectedElements });
    },0);
  },
  actCancelSelectedElements ({ commit }): void {
    commit(types.CANCEL_SELECTED_ELEMENTS);
  },
  actChangeSelectedElementsTansform ({ commit },transform): void {
    commit(types.CHANGE_SELECTED_ELEMENTS_TRANSFORM,{ transform });
  },
  actCancelGroup ({ commit },elementId): void {
    commit(types.CANCEL_GROUP,elementId);
    commit(types.CANCEL_SELECTED_ELEMENTS);
  },

  fetchProject({commit}, {page, pageSize}): void {
    
  }

};

export default actions;
